<link rel="stylesheet" href="css/swiper.css"/>
<div class="swiper-all" data-role='page'>
    <div class="swiper-container">
        <div class="swiper-wrapper" id="swiper-wrapper">
            <a class="swiper-slide" data-index=0 >
                <div class="item-cover"
                     style="background-image: url(https://s1.tuchong.com/event-banners/516938/pc-list.jpg?1)"></div>
                <h4 class="item-title">iPhone摄影赛</h4>
                <p class="item-posts"><i class="prize-icon"></i>iPhone X 以及其他苹果产品</p>
            </a>
            <a class="swiper-slide" data-index=1>
                <div class="item-cover"
                     style="background-image: url(https://s1.tuchong.com/event-banners/518115/pc-list.jpg?1)"></div>
                <h4 class="item-title">2018“百姓生活”摄影双月赛（一月二月赛）</h4>
                <p class="item-posts"><i class="prize-icon"></i>50元现金+年终等级奖+线下展</p>
            </a>
            <a class="swiper-slide" data-index=2 >
                <div class="item-cover"
                     style="background-image: url(https://s1.tuchong.com/event-banners/517450/pc-list.jpg?1)"></div>
                <h4 class="item-title">适马睛典2018</h4>
                <p class="item-posts"><i class="prize-icon"></i>总价值近10万的适马产品</p>
            </a>
            <a class="swiper-slide" data-index=3 >
                <div class="item-cover"
                     style="background-image: url(https://s1.tuchong.com/event-banners/517699/pc-list.jpg?1)"></div>
                <h4 class="item-title">十八岁的模样</h4>
                <p class="item-posts"><i class="prize-icon"></i>祝我们永远十八岁</p>
            </a>
            <a class="swiper-slide" data-index=4 >
                <div class="item-cover"
                     style="background-image: url(https://s1.tuchong.com/event-banners/515177/pc-list.jpg?2)"></div>
                <h4 class="item-title">“童话秘境”冬季冰雪摄影大赛</h4>
                <p class="item-posts"><i class="prize-icon"></i>努比亚手机+三脚架</p>
            </a>
            <a class="swiper-slide" data-index=5 >
                <div class="item-cover"
                     style="background-image: url(https://s1.tuchong.com/event-banners/505379/pc-list.jpg?4)"></div>
                <h4 class="item-title">我要上开屏</h4>
                <p class="item-posts"><i class="prize-icon"></i>图虫APP开屏画面+PC首页+微信周榜精选</p>
            </a>
            <a class="swiper-slide" data-index=6 >
                <div class="item-cover"
                     style="background-image: url(https://s1.tuchong.com/event-banners/514448/pc-list.jpg?1)"></div>
                <h4 class="item-title">佛系摄影</h4>
                <p class="item-posts"><i class="prize-icon"></i>一切随缘</p>
            </a>
            <a class="swiper-slide" data-index=7 >
                <div class="item-cover"
                     style="background-image: url(https://s1.tuchong.com/event-banners/502767/pc-list.jpg?1)"></div>
                <h4 class="item-title">努比亚手机·第三届全国青年摄影大展</h4>
                <p class="item-posts"><i class="prize-icon"></i>120个奖项设置+110部努比亚手机+奖杯+证书</p>
            </a>
            <a class="swiper-slide" data-index=8>
                <div class="item-cover"
                     style="background-image: url(https://s1.tuchong.com/event-banners/422788/app.jpg?0)"></div>
                <h4 class="item-title">「摄影书房」摄影书公开征集</h4>
                <p class="item-posts"><i class="prize-icon"></i>官方推荐+多平台推广+「假杂志」出版</p>
            </a>
            <a class="swiper-slide" data-index=9 >
                <div class="item-cover"
                     style="background-image: url(https://s1.tuchong.com/event-banners/512425/pc-list.jpg?1)"></div>
                <h4 class="item-title">胖电塔与街头摄影19期</h4>
                <p class="item-posts"><i class="prize-icon"></i>有机会入选线上线下街头摄影展</p>
            </a>
        </div>
        <a class="icon-arrow icon-arrow-prev swiper-button-prev" data-dir="prev"></a>
        <a class="icon-arrow icon-arrow-next swiper-button-next" data-dir="next"></a>
    </div>
</div>

<script type="text/javascript">
    var swiper = new Swiper('.swiper-container', {
        loop: true,
        autoplay: 2000,
        autoplayDisableOnInteraction: false,
        slidesPerView: 'auto',
        setWrapperSize: true,
        nextButton: '.swiper-button-next',
        prevButton: '.swiper-button-prev',
    });
</script>